{% extends 'base.html' %}
{% load custom_tags %}

{% block inline_css %}
{{block.super}}
{% include 'tag/list.css' %}
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL}}css/jquery.autocomplete.css">
<style type="text/css">
#search_block {
    padding: 10px;
    background-color: #eee;
}
#search_menu {
}
#search_settings {
    padding-left: 10px;
}
#search_menu ul.view_menu li {
    margin-bottom: 0px;
}
#sort_menu {
    padding: 10px;
}
</style>
{% endblock %}

{% block javascript %}
{{ block.super }}
<script type="text/javascript">
$(document).ready(function() {
    $("#id_query").autocomplete('/tags/autocomplete');
});
</script>
{% endblock %}

{% block title %}
<a href="{% url 'users' %}">Tags</a>
{% if tag_search_form.query.data %}
    &gt; Search: '{{ tag_search_form.query.data }}'
{% endif %}
{% endblock %}

{% block content %}
    <form method="get" action=""> 
    <input type="hidden" name="sort" value="{{ request.GET.sort }}" />
    <div id="search_block">
        <div id="search_menu">
            Search:
            {{ tag_search_form.query }}
            <input type="submit" value="Search" />
        </div>
        <div id="search_settings">
            {% block search_settings %}
            {% endblock %}
        </div>
        </form>
        <div style="clear:both"></div>
    </div>
    <div id="search_results">
        {% block search_results %}
            <div id="sort_menu">
                {% with sort=request.GET.sort %}
                Sort:
                <a {% if sort == 'name' %}class="selected" {% endif %}href="?{% query_string 'sort' 'name' %}&page=1">name</a> | 
                <a {% if sort == 'freq' or not sort %}class="selected" {% endif %}href="?{% query_string 'sort' 'freq' %}&page=1">frequency</a>
                {% endwith %}
            </div>
            {% include 'tag/paginated_list.html' with tag_page=tag_page %}
        {% endblock %}
    </div>
    </form>
{% endblock %}

